<template>
	<el-dialog title="服务维护配置" :visible.sync="dialogVisible" width="600" @close="handleClose"
		:close-on-click-modal="false">
		<div slot="title" class="dialog-header-title">
			<i class="el-icon-edit-outline"></i>
			<span>服务维护配置</span>
		</div>

		<div class="smp-search" v-if="dialogVisible">
			<el-form :inline="false" label-width="100px" size="mini" ref="form" :model="form" :rules="rules">
				<el-row>
						<el-col :span="12">
							<el-form-item label="交易码:">
								<el-input v-model="form.transCode" placeholder="交易码" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="交易名称:">
								<el-input v-model="form.transName" placeholder="交易名称" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="机构号:">
								<el-input v-model="form.systemOrg" placeholder="机构号" ></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="ESB地址:">
								<el-input v-model="form.esbAddr" placeholder="ESB测试地址" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="报文编码:">
								<el-select v-model="form.msgCode" style="width: 100%" placeholder="报文编码" disabled>
									<el-option v-for="item in dict('SMP0004')" :key="item.itemCode" :label="item.itemName" :value="item.itemCode"></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="报文格式:">
								<el-input v-model="form.msgAgreement" placeholder="报文格式" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="服务系统:">
								<el-select v-model="form.systemNo" style="width: 100%" filterable remote reserve-keyword
									placeholder="请输入系统编号或名称" :remote-method="getsystems"  disabled>
									<el-option v-for="item in systemListAll" :key="item.systemNo" :label="item.systemName"
										:value="item.systemNo">
										<span style="float: left;margin-left: 3px;">{{ item.systemNo }}</span>
										<span style="float: right;margin-right: 3px;">{{ item.systemName }}</span>
									</el-option>
								</el-select>
							</el-form-item>
						</el-col>
						
						<el-col :span="12">
							<el-form-item label="测试URL:">
								<el-input v-model="form.testAddr" placeholder="测试URL" disabled></el-input>
							</el-form-item>
						</el-col>
						
						<!-- <el-col :span="12">
							<el-form-item label="生产URL:">
								<el-input v-model="form.prodAddr" placeholder="生产URL" disabled></el-input>
							</el-form-item>
						</el-col> -->
						
						<el-col :span="12">
							<el-form-item label="服务编码:" prop="busCode">
								<el-input v-model="form.busCode" placeholder="服务编码(R值)" :disabled="flag">
									<el-button slot="append" size="mini" plain type="primary" @click="autoGenerate" :disabled="flag">生成</el-button>
								</el-input>
							</el-form-item>
						</el-col>
						
				<!-- 		<el-col :span="22">
							<el-form-item label="业务路由:" prop="busPath">
								<el-select v-model="form.busPath" style="width: 100%" filterable remote reserve-keyword
									placeholder="请输入业务路由"
									:loading="proLoading"
								
									:remote-method="getbusPathList" >
									<el-option v-for="item in busPathList" :key="item.sourcePath" :label="item.sourcePath" :value="item.sourcePath">
										<span style="float: left;margin-left: 3px;">{{ item.sourceName }}</span>
										<span style="float: right;margin-right: 3px;">{{ item.sourcePath }}</span>
									</el-option>
								</el-select>	
							</el-form-item>
						</el-col>
						
						<el-col :span="2">
							<el-button size="mini" type="primary"  @click="addESBSource" style="width: 56px;"> 创 建 </el-button>
						</el-col>
						
						
						<el-col :span="22">
							<el-form-item label="业务路由(外联):" prop="busPath">
								<el-select v-model="form.oesbBusPath" style="width: 100%" filterable remote reserve-keyword
									placeholder="请输入业务路由"
									:loading="proLoading"
								
									:remote-method="getbusPathList" >
									<el-option v-for="item in busPathList" :key="item.sourcePath" :label="item.sourcePath" :value="item.sourcePath">
										<span style="float: left;margin-left: 3px;">{{ item.sourceName }}</span>
										<span style="float: right;margin-right: 3px;">{{ item.sourcePath }}</span>
									</el-option>
								</el-select>	
							</el-form-item>
						</el-col>
						
						<el-col :span="2">
							<el-button size="mini" type="primary"  @click="addESBSource" style="width: 56px;"> 创 建 </el-button>
						</el-col> -->
				</el-row>


			</el-form>
		</div>
		
		<addESBSource ref="addESBSource" @changeBusPath="changeBusPath"/>
		
		
		<span slot="footer" class="dialog-footer">
			<el-button size="mini" type="primary" plain @click="onSubmit">确定</el-button>
			<el-button size="mini" @click="closeDialog" plain>取消</el-button>
		</span>
	</el-dialog>
</template>

<script>
	"use strict";
	import {autoGenerateBusCode, updateApplyServerInfo} from '@/api/demand.js';
	import {getproList,getproListBysourcePath} from '@/api/source.js';
	import addESBSource from './addESBSource';
	
	export default {
		components: {
			addESBSource
		},
		data() {
			return {
				dialogVisible: false,
				flag: true,
				rules: {
					busCode: [{
						required: true,
						message: "服务编码(R值)不能为空",
						trigger: ['blur', 'change']
					}],
					busPath: [{
						required: true,
						message: "业务路由不能为空",
						trigger: ['blur', 'change']
					}]
				},
				form: {
					busPath: '',
					proxyPath: ''
				},
				sourceFolder:'',
				busPathList:[],
				proLoading:false,

			};
		},


		methods: {

			onSubmit() {
				this.updateApplyServerInfo();
			},
			
			autoGenerate(){
				this.autoGenerateBusCode();
			},
			
			autoGenerateBusCode(){
				autoGenerateBusCode({"systemNo":this.form.systemNo}).then(response =>{
					this.form.busCode = response.data.extend;
					this.$message({
						duration:5000,
						type: 'success',
						message: '服务编码（R值）自动生成成功！'
					});
				}).catch(error =>{
					this.$message({
						duration:5000,						type: 'error',
						message: '服务编码（R值）自动生成失败！'
					});
				})
			},
			
			
			
			updateApplyServerInfo() {
				this.$refs["form"].validate(valid => {
					if (valid) {
						updateApplyServerInfo(this.form).then(response => {
							this.$message({
						duration:5000,							type: 'success',
								message: '服务维护配置成功！'
							});
							this.dialogVisible = false;
							this.$emit("getList");

						}).catch(error => {
							thithis.$message({
						duration:5000,						type: 'error',
								message: '服务维护配置失败！'
							});
							this.dialogVisible = false;
						});
					}
				})
			},

			showDialog(row) {
				this.form = row;
				let busCode = this.form.busCode;
				 if(busCode == null || busCode == ''){
					this.flag = false;
				}else{
					this.flag = true;
				} 
				//根据系统编号获取系统信息
			 let system =  this.$store.getters.getSystem(this.form.systemNo);
			 
			 console.info(JSON.stringify(system));
				this.sourceFolder = system.busPath
				
				this.dialogVisible = true;

			},

			closeDialog() {
				this.dialogVisible = false;
			},

			handleClose() {
				this.dialogVisible = false;
			},
			
			//获取业务路由
			getbusPathList(query){
				if(query!=''){
					this.proLoading = true;
					getproList({"sourcePath":query,"sourceType":"03","sourceFolder":this.sourceFolder}).then(response => {
					this.busPathList = response.data.extend;
					this.proLoading = false;
				});
				}
			},
			
			/* proChange(val){
				this.form.busPath = 
				this.busPathList.filter(item=>{
					return item.busPath == val;
				})[0].busPath;
			}, */
			
			addESBSource(){
				this.$refs.addESBSource.showDialog("03",this.sourceFolder);
			},
			
			changeBusPath(sourcePath){
				getproList({"sourcePath":sourcePath,"sourceType":"03","sourceFolder":this.sourceFolder}).then(response =>{
					this.busPathList = response.data.extend;
					this.form.busPath = sourcePath
				}).catch(error => {
					console.info("失败");
					console.info(error.message);
				})
			},
			


		},

	}
</script>

<style>
</style>
